<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      let xhr = new XMLHttpRequest();
      let url = "http://jsonplaceholder.typicode.com/posts?_limit=10&_page=1";
      //   let res;
      xhr.open("GET", url);
      xhr.send();
      xhr.addEventListener("readystatechange", function () {
        if (xhr.readyState == 4) {
          if (xhr.status == 200) {
            // let data = xhr.responseText;
            // console.log(data);
            let data = JSON.parse(xhr.responseText);
            // console.log(res);
            haha(data);
          }
        }
      });
      function haha(data) {
        let div = document.createElement("div");
        data.forEach(function (ele) {
          div.innerHTML += `<p>${ele.id}</p><p>${ele.title}</p><p>${ele.body}</p>`;
        });
        document.body.appendChild(div);
      }
    </script>
  </body>
</html>
